<!doctype html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="../css/mui.min.css" rel="stylesheet" />
		<link rel="stylesheet" href="../css/icons-extra.css" />
	</head>

	<body>
		<header class="mui-bar mui-bar-nav">	
			<a class="mui-icon mui-icon-back mui-action-back mui-pull-left"></a>
			<h1 class="mui-title ">Camera</h1>
			<a class="mui-icon-extra mui-icon-extra-topic mui-pull-right" style="margin-top: 10px;"
				 onclick="openWindow('docCamera','../doc/camera.html?v=20190621')"></a>
		</header>
		<div class="mui-content">
			<div class="mui-content-padded">
				<div class="mui-row">
					Camera模块管理设备的摄像头，可用于拍照、摄像操作，通过plus.camera获取摄像头管理对象。
				</div>
				<div class="mui-button-row">
					<button type="button" class="mui-btn mui-btn-success mui-btn-block" onclick="captureImage()">拍照</button>
					<button type="button" class="mui-btn mui-btn-primary mui-btn-block" onclick="videoCapture();">摄像</button>
				</div>
				<ul id="history" class="dlist" style="text-align:left;">
					<li id="nohistory" class="ditem" onclick="onempty()">无历史记录	</li>
				</ul>
				<br />
				<div class="mui-row" style="text-align: center;">
					<img id="image" src="../images/barcode.png"/>
				</div>
				
				<div class="mui-row" id="divInfo"></div>
			</div>
		</div>
		<script src="../js/mui.min.js"></script>
		<script type="text/javascript" src="../js/app.js" ></script>
		<script type="text/javascript">
			mui.init();
			function outSet(message){
				document.getElementById("divInfo").innerText = message;
			}
			
			function outLine(message){
				var text = document.getElementById("divInfo").innerText;
				document.getElementById("divInfo").innerText = text + "\n" + message;
			}
			
			mui.plusReady(function(){
				
			});
			
			// 拍照
			function captureImage(){
				var cmr = plus.camera.getCamera();
				var res = cmr.supportedImageResolutions[0];
				var fmt = cmr.supportedImageFormats[0];
				outSet("Resolution: "+res+", Format: "+fmt);
				cmr.captureImage( function( path ){
						outLine( "Capture image success: " + path );
						plus.io.resolveLocalFileSystemURL( path, function( entry ) {
							// 可通过entry对象操作test.html文件 
							entry.file( function(file){
								var fileReader = new plus.io.FileReader();
								//alert("getFile:" + JSON.stringify(file));
								fileReader.onloadend = function(evt) {
									outLine("11" + evt);
									outLine("evt.target" + evt.target);
									outLine(evt.target.result);
									
									var image = document.getElementById('image');
									image.src = evt.target.result;
								}
								fileReader.readAsDataURL(file);
							} );
						}, function ( e ) {
							alert( "Resolve file URL failed: " + e.message );
						} );
					},
					function( error ) {
						outLine( "Capture image failed: " + error.message );
					},
					{resolution:res,format:fmt}
				);
			}
			
			// 摄像
			function videoCapture(){
				var cmr = plus.camera.getCamera();
				var res = cmr.supportedVideoResolutions[0];
				var fmt = cmr.supportedVideoFormats[0];
				outSet("Resolution: "+res+", Format: "+fmt);
				cmr.startVideoCapture( function( path ){
						outLine( "Capture video success: " + path );  
						//读取文件内容
						var url=plus.io.convertLocalFileSystemURL(path);
						console.log(url);
						mui.openWindow({
							id:"camera_video",
							url:"camera_video.html",
							extras:{
						      src:"file://"+url
						    },
						})
					},
					function( error ) {
						outLine( "Capture video failed: " + error.message );
					},
					{resolution:res,format:fmt}
				);
			}
		</script>
	</body>

</html>